@extends('admin.layouts.wap_simple')
@section('title', '开始认证小程序')
@section('content')
<meta name="csrf-token" content="{{ csrf_token() }}">
<input type="hidden" id="appid" value="{{ $appid }}">
<div class="main-back">
    <div class="m-card" style="overflow-y: auto;">
        <div class="m-form-item m-col-12 m-xs-12">
            <label><b>*</b>小程序认证类型:</label>
            <div class="badge-lists" id="corpType">
                <ul>
                    <li data=1 class="active">企业</li>
                    <li data=12>个体工商户</li>
                    <li data=15>个人</li>
                </ul>
            </div>
        </div>
        <div class="m-form-child-title">
            <label>联系人信息:</label>
            <div onclick="multiplex();">
                <font>复用联系人模版</font>
                <i class="bx bx-chevrons-up"></i>
            </div>
        </div>
        <div class="m-form-child m-col-12 m-xs-12">
            <div class="m-form-item">
                <label><b>*</b>认证联系人姓名:</label>
                <div class="m-col-12">
                    <input type="text" class="m-input" id="contact_info_name" placeholder="请输入认证联系人姓名" maxlength="10" value="">
                </div>
            </div>
            <div class="m-form-item">
                <label><b>*</b>认证联系人邮箱:</label>
                <div class="m-col-12">
                    <input type="text" class="m-input" id="contact_info_email" placeholder="请输入认证联系人邮箱" maxlength="50" value="">
                </div>
            </div>
        </div>
        <div class="m-form-item corp-type-not-15">
            <label>
                <b>*</b>主体资质材料:
            </label>
            <div>
                <a href="javascript:;" class="m-file" style="float:left;margin-left: 0px;">
                    <font>上传</font>
                    <input type="file" name="upload_qualification_img" id="upload_qualification_img" onchange="jsUpload('qualification_img',1024,true,{},'all')">
                </a>
                <img src="" class="m-file-image" id="qualification_img_show" style="max-width: 300px;">
                <input type="hidden" name="qualification_img" id="qualification_img" value="">
            </div>
        </div>
        <div class="m-form-item corp-type-not-15" id="other_qualification_img_show">
            <label>
                主体资质其他证明材料:
            </label>
            <div>
                <a href="javascript:;" class="m-file" style="float:left;margin-left: 0px;">
                    <font>上传</font>
                    <input type="file" name="upload_qualification_other_img" id="upload_qualification_other_img" onchange="jsUpload('qualification_other_img',1024,true,{},'all')">
                </a>
                <img src="" class="m-file-image" id="qualification_other_img_show" style="max-width: 300px;">
                <input type="hidden" name="qualification_other_img" id="qualification_other_img" value="">
            </div>
        </div>
        <div class="m-form-item m-col-12 m-xs-12">
            <label><b>*</b>小程序名称:</label>
            <div class="m-col-12">
                <input type="text" class="m-input" id="account_name" placeholder="请输入小程序名称" maxlength="20" value="{{ $miniapp->name }}">
            </div>
        </div>
        <div class="m-form-item m-col-12 m-xs-12">
            <label><b>*</b>小程序账号名称命名类型:</label>
            <div class="badge-lists" id="account_name_type">
                <ul>
                    <li data=1 class="active">基于自选词汇命名</li>
                    <li data=2>基于商标命名</li>
                </ul>
            </div>
        </div>
        <div class="m-form-item" style="display: none;" id="keyword_show">
            <label>
                <b>*</b>名称命中关键词-补充材料:
            </label>
            <div>
                <a href="javascript:;" class="m-file" style="float:left;margin-left: 0px;">
                    <font>上传</font>
                    <input type="file" name="upload_account_supplemental_img" id="upload_account_supplemental_img" onchange="jsUpload('account_supplemental_img',1024,true,{},'all')">
                </a>
                <img src="" class="m-file-image" id="account_supplemental_img_show" style="max-width: 300px;">
                <input type="hidden" name="account_supplemental_img" id="account_supplemental_img" value="">
            </div>
        </div>
        <div class="m-form-item">
            <div class="m-form-btn m-mr-1" onclick="submitAuth();">立即开始认证</div>
        </div>
    </div>
</div>
<div class="modal fade" id="personModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-service-dialog">
        <div class="modal-content modal-service-cotain modal-content-ts">
            <div class="modal-service-body">
                <div class="m-form-item m-col-12 m-xs-12">
                    <label><b>*</b>请选择联系人模版:</label>
                    <div class="badge-lists" id="person">
                        <ul>
                           
                        </ul>
                    </div>
                </div>
            </div>
            <div class="modal-service-close">
                <i class="iconfont icon-delete_y" onclick="closePerson();"></i>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="/assets/admin/js/dev/image.upload.875451.js?v={{ time() }}"></script>
<script src="https://file.wailian1.cn/admin/assets/admin/js/libs/image-conversion/conversion.js"></script>
<script type="text/javascript">
    var authData = {
        "customer_type": 1,
        "taskid":"",  
        "contact_info":{
            "name":"",
            "email":"",
        },
        "qualification":'',
        "qualification_image":'',
        "qualification_other":[],
        "qualification_other_image":[],
        "account_name":"",
        "account_name_type":1,
        "account_supplemental":[],
        "account_supplemental_image":[],
        "pay_type":1,
        "third_party_phone":'',
        "service_appid":'',
    };
    $(function() {
        $("#corpType li").click(function() {
            $(this).addClass("active").siblings().removeClass("active");
            if($(this).attr("data") == 15){
                $(".corp-type-not-15").hide();
            }else{
                $(".corp-type-not-15").show();
            }
        });
        $("#account_name_type li").click(function() {
            $(this).addClass("active").siblings().removeClass("active");
            if($(this).attr("data") == 2){
                $("#keyword_show").show();
            }else{
                $("#keyword_show").hide();
            }
        });
    });

    function multiplex(){
        $.ajax({
            "url": "/admin/template/template_person",
            "data": {},
            success: function(res){
                console.log(res);
                if (res.status == "success") {
                    if(res.data.length == 0){
                        mviewToastr("error","暂无联系人模版，请先添加联系人模版!");
                    }else if(res.data.length == 1){
                        $("#contact_info_name").val(res.data[0].manage_name);
                        $("#contact_info_email").val(res.data[0].manage_email);
                    }else{
                        $("#person ul").html('');
                        for(var i=0;i<res.data.length;i++){
                            var html = `<li onclick="selPerson('${res.data[i].manage_name}','${res.data[i].manage_email}')">${res.data[i].manage_name}</li>`;
                            $("#person ul").append(html);
                        }
                        $("#personModal").modal('toggle');
                    }
                } else {
                    mviewToastr("error",err_text,5);
                }
            },
            error: function(err){
                mviewToastr("error","网络异常,请刷新网页后重试!");
            }
        });
    }

    function closePerson(){
        $("#personModal").modal('hide');
    }

    function selPerson(name,email){
        $("#contact_info_name").val(name);
        $("#contact_info_email").val(email);
        $("#personModal").modal('hide');
    }

    function submitAuth(){
        authData.customer_type = $("#corpType li.active").attr("data");
        authData.contact_info.name = $("#contact_info_name").val();
        authData.contact_info.email = $("#contact_info_email").val();
        authData.account_name = $("#account_name").val();
        authData.account_name_type = $("#account_name_type li.active").attr("data");
        authData.qualification_image = $("#qualification_img").val();
        authData.qualification_other_image = [$("#qualification_other_img").val()];
        authData.account_supplemental_image = [$("#account_supplemental_img").val()];
        if(authData.contact_info.name.length <= 1){
            mviewToastr("error","联系人姓名不能少于1位!");
            return;
        }
        if(!isEmail(authData.contact_info.email)){
            mviewToastr("error","请输入正确的邮箱地址!");
            return;
        }
        if(authData.account_name.length <= 2){
            mviewToastr("error","小程序账号名称不能少于3位!");
            return;
        }
        if(authData.account_name_type == 2 && $("#account_supplemental_img").val() == ''){
            mviewToastr("error","基于商标命名必须上传补充材料");
            return;
        }
        if(authData.customer_type != 15 && $("#qualification_img").val() == ''){
            mviewToastr("error","非个人类型必填营业执照资质材料");
            return;
        }
        var appid = $("#appid").val();
        var _token = $('meta[name="csrf-token"]').attr('content');
        $.ajax({
            "url": "/admin/miniapps/wxaauth/"+appid,
            "type": "POST",
            "data": {"authInfo":authData,"appid":appid},
            headers: {
                'X-CSRF-TOKEN': _token
            },
            success: function(res){
                console.log(res);
                // window.location.replace('/admin/template/beian');      
            },
            error: function(err){
                mviewToastr("error","请求失败,请稍后重试！");
            }
        });
    }

    function jsUploadCallBack(id,imageurl,imageName,updata,other) {
        console.log(id);
        console.log(imageurl);
        console.log(imageName);
        console.log(updata);
        console.log(other);
    }

    //判断邮箱
    function isEmail(email) {
        var reg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/;
        return reg.test(email);
    }
</script>
@endsection
